<template>
    <div>
        <el-row>
            <el-col :span="24" class="base-mian-cell" v-if="claimsFlag">
                <div class="base-mian-cell-title clearfix">
                    <div class="left fl">
                        <span class="line">|</span>
                        <span class="tips">理赔记录</span>
                    </div>
                    <div class="right fr" @click="changeView">
                        <i class="el-icon-circle-close"></i>
                    </div>
                </div>
                <div class="base-mian-cell-main">
                    <el-table
                            :data="claimData"
                            style="width: 100%">
                        <el-table-column
                                prop="claimNo"
                                label="理赔号码"
                                min-width="120" 
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="policyNo"
                                label="保单号码"
                                min-width="120" 
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="claimShape"
                                label="理赔型态"
                                min-width="120" 
                                show-overflow-tooltip>
                            <template slot-scope="scope">
                                {{scope.row.claimShape | claimtypePipe}}
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="accidentIdentity"
                                label="事故人身份"
                                min-width="120" 
                                show-overflow-tooltip>
                            <template slot-scope="scope">
                                {{scope.row.accidentIdentity | lifePipe}}
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="accidentName"
                                label="事故人"
                                min-width="120"
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="acceptDate"
                                label="受理日期"
                                min-width="160" 
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="closeDate"
                                label="结案日期"
                                min-width="160" 
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="cognizanceDate"
                                label="身故/残疾/重疾认定日"
                                min-width="160" 
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="accidentDate"
                                label="意外事故日"
                                min-width="160" 
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="claimAmount"
                                label="给付金额"
                                min-width="120" 
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="instalmentPayment"
                                label="是否分期给付"
                                min-width="120" 
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="stagepayment"
                                label="分期给付金"
                                min-width="120" 
                                show-overflow-tooltip>
                        </el-table-column>
						<el-table-column
                                prop="diseaseOne"
                                label="伤病代码一"
                                min-width="120"
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="diseaseTwo"
                                label="伤病代码二"
                                min-width="120"
                                show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                                prop="diseaseThree"
                                label="伤病代码三"
                                min-width="120"
                                show-overflow-tooltip>
                        </el-table-column>
                    </el-table>
                </div>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="24">
                <div class="pagination">
                    <el-pagination
                            background
                            v-if='paginations.total > 0'
                            :page-sizes="paginations.pageSizes"
                            :page-size="paginations.pageSize"
                            :layout="paginations.layout"
                            :total="paginations.total"
                            :current-page='paginations.pageIndex'
                            @current-change='handleCurrentChange'
                            @size-change='handleSizeChange'>
                    </el-pagination>
                </div>
            </el-col>
        </el-row>
    </div>
</template>
<script>
  import {
    claimHistory
  } from "@/api/underwriting/renewal";
  import constant from '@/utils/constant';
  export default {
    data(){
      return{
        claimData: [],
        paginations: {
          total: 0,        // 总数
          pageIndex: 1,  // 当前位于哪页
          pageSize: 10,   // 1页显示多少条
          pageSizes: [5, 10, 15, 20],  //每页显示多少条
          layout: "total, sizes, prev, pager, next, jumper"   // 翻页属性
        },
      }
    },
    props:{
      claimsFlag:{
        type: Boolean,
        default: false
      },
      policyNo:{
        type: String,
        default: ""
      },
      // claims:{
      //   type: Array,
      //   default(){
      //     return [];
      //   }
      // }
    },
    methods:{
      changeView(){
        this.$emit('subClaimsFlag',false);
      },
      handleCurrentChange(page) {
        this.paginations.pageIndex = page;
        this.search();
      },
      // 照会代码弹框切换每页数据大小
      handleSizeChange() {
        this.paginations.pageSize = pageSize;
        this.search();
      },
      search(){
        let that= this;
        debugger
        let params = {
          "pageSize": this.paginations.pageSize,
          "pageNumber": this.paginations.pageIndex,
          "policyNo": this.policyNo
        }
        that.$emit('showLoading',true);
        claimHistory(params).then(res => {
          that.$emit('showLoading',false);
          if (res.resultCode == constant.SUCCESS && res.data != null) {
            this.claimData = res.data.list;
            this.paginations.total = res.data.total
          }
        }).catch(err => {
        })
      }
    },
    created() {
      this.search();
    },
    filters: {
      claimtypePipe: function (value) {
        var temp ="";
        if(value == 'D'){
          temp = 'D-身故'
        } else if(value == 'T'){
          temp = 'T-全残'
        } else if(value == 'P') {
          temp = 'P-部分残疾'
        } else if(value == 'C') {
          temp = 'C-重大病疾'
        }else if(value == 'N') {
          temp = 'N-一般医疗'
        }else if(value == 'S') {
          temp = 'S-慰问金'
        }
        return temp
      },
      lifePipe: function (value) {
        var temp ="";
        if(value == '0'){
          temp = '被保险人'
        } else if(value == '1'){
          temp = '投保人'
        }
        return temp
      },
    }
  }
</script>
<style lang="less" scoped>

</style>